<template>
	<div class="app">
		<h2>我是App组件</h2>
		<h3 v-show="ming">School组件给我的学校名:{{ming}}</h3>
		<!-- 第一种：下面这行含义是：给School组件的实例对象（vc）绑定了一个haha事件（自定义事件），使用v-on或@绑定 -->
		<!-- <School @haha="test"/> -->

		<!-- 第二种：下面这行含义是：给School组件的实例对象（vc）绑定了一个haha事件（自定义事件）-->
		<School ref="xuexiao"/>
	</div>
</template>

<script>
	import School from './components/School'

	export default {
		name:'App',
		components:{School},
		data() {
			return {
				ming:''
			}
		},
		methods: {
			test(value){
				console.log('我给School组件实例对象绑定的haha事件被触发了，并且携带了一个值',value)
				this.ming = value
			}
		},
		mounted(){
			this.$refs.xuexiao.$on('haha',this.test)
		}
	}
</script>

<style>
	.app{
		background-color: gray;
		padding: 20px;
	}
</style>